{include file="public/layout.htm" /}
<body class="back-c">
    <div class="ey-content">
        <div class="nav-tab-block">
            <div class="tab-wrap">
                <div class="tab-item active">基础设置</div>
                <div class="tab-item ">商品详情</div>
                <div class="tab-item ">商品参数</div>
            </div>
        </div>
        
        <form id="post_form" action="{:weapp_url('Mbackend/ShopProduct/edit', ['source'=>'save'])}" method="post">
        <input type="hidden" name="aid" value="{$field.aid|default='0'}">
        <div class="item-wrap-box" style="display: block;">
            <div class="item-wrap">
                    <div class="order-list">
                        <div class="list-left">商品名称<em class="color-red-text">*</em></div>
                        <div class="list-right">
                            <div class="ey-input">
                                <div class="ey-input-wrapper">
                                    <input type="text" name="title" id="title" value="{$field.title}" class="ey-input-input" maxlength="200" {eq name="$channelRow.is_repeat_title" value="0"} oninput="check_title_repeat(this, 0);" {/eq}>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="order-list">
                        <div class="list-left">商品副标题</div>
                        <div class="list-right">
                            <div class="ey-input">
                                <div class="ey-input-wrapper">
                                    <input type="text" name="subtitle" id="subtitle" value="{$field.subtitle}" class="ey-input-input" maxlength="200" placeholder="请输入商品副标题">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="order-list">
                        <div class="list-left">商品标签</div>
                        <div class="list-right">
                            <div class="ey-input">
                                <div class="ey-input-wrapper">
                                    <input type="text" name="marketing_label" value="{$field.marketing_label}" class="ey-input-input" placeholder="请输入商品标签,不可超过4个字符" autocomplete="off" oninput="inputLengthShow(this, 'marketing_label');" maxlength="4" onpropertychange="if(value.length>4) value=value.substr(0,4)">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="order-list">
                        <div class="list-left">商品服务</div>
                        <div class="list-right">
                            <div class="ml_auto" onclick="openArcAttr();">编辑<i class="iconfont icon-right"></i></div>
                        </div>
                    </div>
                    <div id="arcAttr" style="display: none;">
                        {volist name='$goodsLabel' id='vo'}
                            <input type="hidden" name="attr[goodsLabelID[]]" value="0" class="allAttr attr_goodsLabelID[]" field="goodsLabelID[]">
                            <label class="checkbox-label">
                                <input type="checkbox" class="checkbox new_attr_goodsLabelID[]" name="goodsLabelID[]" value="{$vo.label_id}" {notempty name="$vo.selected"}checked="checked"{/notempty} onclick="selectArcAttr('.attr_goodsLabelID[]', '.new_attr_goodsLabelID[]');">
                                <span class="check-mark"></span>
                                <span class="text">{$vo.label_title}</span>
                            </label>
                        {/volist}
                    </div>
                    <div class="order-list">
                        <div class="list-left">商品主图</div>
                        <div class="list-right">
                            <div class="item-flex-img">
                                <a href="javascript:void(0);" id="a_litpic_local" onclick="$('#onclick_litpic_local').trigger('click');" class="img-upload mb15" title="点击上传">
                                    <div class="y-line" {notempty name="$field.litpic"} style="display: none;" {/notempty}></div>
                                    <div class="x-line" {notempty name="$field.litpic"} style="display: none;" {/notempty}></div>
                                    <img src="{$field.litpic|default=''}" {empty name="$field.litpic"} style="display: none;" {/empty}>
                                </a>
                                <input type="file" id="onclick_litpic_local" onchange="upload_litpic_local(this);" style="display: none;">
                                <input type="hidden" name="litpic_local" id="img_litpic_local" value="{$field.litpic|default=''}">
                            </div>
                        </div>
                    </div>
                    <div class="order-list">
                        <div class="list-left">商品轮播图</div>
                        <div class="list-right inline-block">
                            <div class="tab-pane">
                                {volist name="proimg_list" id="vo" key="k"}
                                <div class="images_upload">
                                    <div class="images_upload_item">
                                        <input type="hidden" name="proimg[]" value="{$vo['image_url']}">
                                        <a class="img-upload" href="{$vo['image_url']}" target="_blank"><img src="{$vo['image_url']}"></a>
                                        <a href="javascript:void(0)" onclick="clear_{$vo.fieldArr}_{$vo.name|default=''}(this, '{$vo['image_url']}')" class="delect"></a>
                                    </div>
                                </div>
                                {/volist}
                                <div class="images_upload_main" id="imgs_{$vo.fieldArr}_{$vo.name|default=''}">
                                    <a href="javascript:void(0);" onclick="$('#onclick_{$vo.fieldArr}_{$vo.name|default=''}').trigger('click');" class="img-upload mb15" title="点击上传">
                                        <div class="y-line"></div>
                                        <div class="x-line"></div>
                                    </a>
                                    <input type="file" multiple id="onclick_{$vo.fieldArr}_{$vo.name|default=''}" onchange="upload_{$vo.fieldArr}_{$vo.name|default=''}(this);" style="display: none;">
                                </div>
                            </div>
                        </div>
                    </div>
                    <script type="text/javascript">
                        // 图片上传
                        function upload_{$vo.fieldArr}_{$vo.name|default=''}(obj) {
                            var file = $(obj)[0].files;
                            var uploadLength = 0;
                            var fileLength = file.length;
                            var imgField = "{$vo.fieldArr}_{$vo.name|default=''}";
                            layerLoading('正在上传');
                            for (var i = 0; i < file.length; i++) {
                                if (file[i]) {
                                    var formData = new FormData();
                                    formData.append('_ajax', 1);
                                    formData.append('weappAjax', 1);
                                    formData.append('compress', '1000-1000');
                                    formData.append('file', file[i]);
                                    $.ajax({
                                        type: 'post',
                                        url : "{:url('Ueditor/imageUp')}",
                                        data: formData,
                                        dataType: 'json',
                                        contentType: false,
                                        processData: false,
                                        success: function (res) {
                                            if (res.state == 'SUCCESS') {
                                                // 加载图片
                                                var picHtml = 
                                                    '<div class="images_upload">'+
                                                        '<div class="images_upload_item">'+
                                                            '<input type="hidden" name="{$vo.fieldArr}[{$vo.name|default=''}][]" value="' + res.url + '" />'+
                                                            '<a class="img-upload" href="' + res.url + '" target="_blank"><img src="' + res.url + '"/></a>'+
                                                            '<a  class="delect" href="javascript:void(0);" onclick="clear_'+imgField+'(this, \'' + res.url + '\')"></a>'+
                                                        '</div>'+
                                                    '</div>';
                                                $("#imgs_"+imgField).before(picHtml);
                                                // 如果是最后一张则关闭加载提示
                                                uploadLength++;
                                                if (parseInt(fileLength) === parseInt(uploadLength)) {
                                                    layer.closeAll();
                                                }
                                            } else {
                                                layerAlert(res.state);
                                            }
                                        },
                                        error : function(e) {
                                            layer.closeAll();
                                            layerAlert(e.responseText);
                                        }
                                    })
                                }
                            }
                        }
                    
                        // 图片删除
                        function clear_{$vo.fieldArr}_{$vo.name|default=''}(obj, path) {
                            $.ajax({
                                type: 'GET',
                                url : "{:url('Uploadimgnew/delupload', ['_ajax' => 1, 'weappAjax' => 1])}",
                                data: {action: "del", filename: path},
                                success:function() {
                                    $(obj).parent().parent().remove();   
                                }
                            });
                        }
                    </script>
                    <div class="order-list">
                        <div class="list-left">商品规格</div>
                        <div class="list-right">
                            <div class="select">
                                <select name="spec_type" id="">
                                    <option value="1" {empty name="$useSpecNum"}selected{/empty}>单规格</option>
                                    <option value="2" {notempty name="$useSpecNum"}selected{/notempty}>多规格</option>
                                </select>
                            </div>
                            <i class="iconfont icon-right"></i>
                        </div>
                    </div>
                    <div  {notempty name="$useSpecNum"} style="display: none;" {/notempty}>
                        <div class="order-list">
                            <div class="list-left">销售价<em class="color-red-text">*</em></div>
                            <div class="list-right">
                                <div class="ey-input">
                                    <div class="ey-input-wrapper">
                                        <input class="ey-input-input" type="text" name="users_price" id="users_price" value="{$field.users_price}" onpaste='this.value=this.value.replace(/^\D*([0-9]\d*\.?\d{0,2})?.*$/, "$1");' onkeyup='this.value=this.value.replace(/^\D*([0-9]\d*\.?\d{0,2})?.*$/, "$1");'>
                                        <span class="t">元</span>
                                    </div>
                                    
                                </div>
                            </div>
                        </div>
                        <div class="order-list">
                            <div class="list-left">划线价</div>
                            <div class="list-right">
                                <div class="ey-input">
                                    <div class="ey-input-wrapper">
                                        <input class="ey-input-input" type="text" name="crossed_price" id="crossed_price" value="{$field.crossed_price}" onpaste='this.value=this.value.replace(/^\D*([0-9]\d*\.?\d{0,2})?.*$/, "$1");' onkeyup='this.value=this.value.replace(/^\D*([0-9]\d*\.?\d{0,2})?.*$/, "$1");'>
                                        <span class="t">元</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        
                        <div class="order-list">
                            <div class="list-left">会员折扣价</div>
                            <div class="list-right">
                                <div class="select">
                                    <select name="" id="">
                                        <option value="系统默认">系统默认</option>
                                        <option value="指定会员级别">指定会员级别</option>
                                        <option value="不参与">不参与</option>
                                    </select>
                                </div>
                                <i class="iconfont icon-right"></i>
                            </div>
                        </div>
                        <div class="order-list">
                            <div class="list-left">商品库存<em class="color-red-text">*</em></div>
                            <div class="list-right">
                                <div class="ey-input">
                                    <div class="ey-input-wrapper">
                                        <input class="ey-input-input" type="text" name="stock_count" id="stock_count" value="{$field.stock_count}" maxlength="9" onpaste='this.value=this.value.replace(/^\D*([0-9]\d*)?.*$/, "$1");' onkeyup='this.value=this.value.replace(/^\D*([0-9]\d*)?.*$/, "$1");'>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="order-list">
                            <div class="list-left">虚拟销量</div>
                            <div class="list-right">
                                <div class="ey-input">
                                    <div class="ey-input-wrapper">
                                        <input class="ey-input-input" type="text" name="virtual_sales" id="virtual_sales" value="{$field.virtual_sales}" maxlength="9" onpaste='this.value=this.value.replace(/^\D*([0-9]\d*)?.*$/, "$1");' onkeyup='this.value=this.value.replace(/^\D*([0-9]\d*)?.*$/, "$1");'>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <div class="order-list">
                        <div class="list-left">商品单位</div>
                        <div class="list-right">
                            <div class="ey-input">
                                <div class="ey-input-wrapper">
                                    <!-- 判断如果是系统设置就直接写在value值里，自定义的话就修改原来的值 -->
                                    <input class="ey-input-input" type="text" name="goods_unit" id="goods_unit" value="{$field.goods_unit|default=$usersConfig.goods_unit}" placeholder="请输入商品单位" autocomplete="off" oninput="inputLengthShow(this, 'goods_unit');" maxlength="3" onpropertychange="if(value.length>3) value=value.substr(0,3)">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="order-list">
                        <div class="list-left">发货方式</div>
                        <div class="list-right">
                            <div class="ml_auto" onclick="openLogistics();">编辑<i class="iconfont icon-right"></i></div>
                        </div>
                    </div>
                    <div id="logisTics" style="display: none;">
                        <input type="hidden" name="attr[logistics_type[]]" value="0" class="allAttr attr_logistics_type[]" field="logistics_type[]">
                        <label class="checkbox-label">
                            <input type="checkbox" class="checkbox new_logistics_type[]" name="logistics_type[]" value="1" {if condition="in_array(1, $field.logistics_type)"}checked="checked"{/if} onclick="selectLogistics('.logistics_type[]', '.new_logistics_type[]');">
                            <span class="check-mark"></span>
                            <span class="text">快递发货</span>
                        </label>
                        <input type="hidden" name="attr[logistics_type[]]" value="0" class="allAttr attr_logistics_type[]" field="logistics_type[]">
                        <label class="checkbox-label">
                            <input type="checkbox" class="checkbox new_logistics_type[]" name="logistics_type[]" value="2" {if condition="in_array(2, $field.logistics_type)"}checked="checked"{/if} onclick="selectLogistics('.logistics_type[]', '.new_logistics_type[]');">
                            <span class="check-mark"></span>
                            <span class="text">到店核销</span>
                        </label>
                    </div>
                    <div class="order-list">
                        <div class="list-left">上架设置</div>
                        <div class="list-right">
                            <div class="list-right">
                                <div class="select">
                                    <select name="arcrank">
                                        <option value="0" {egt name="$field.arcrank" value="0"}selected{/egt}>立即上架</option>
                                        <option value="-1" {eq name="$field.arcrank" value="-1"}selected{/egt}>放入仓库</option>
                                    </select>
                                </div>
                                <i class="iconfont icon-right"></i>
                            </div>
                        </div>
                    </div>
            </div>
            
        </div>
        <div class="item-wrap-box">
            <div class="item-wrap">
                <div class="order-list">
                    <div class="list-left">内容详情</div>
                    <div class="list-right">
                        <div class="ml_auto" onclick="openContent({$field.aid});">编辑<i class="iconfont icon-right"></i></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="item-wrap-box">
            <div class="item-wrap">
                <div class="order-list">
                    <div class="list-left"><i class="iconfont icon-delete-s"></i>操作系统</div>
                    <div class="list-right">
                        <div class="ey-input">
                            <div class="ey-input-wrapper">
                                <input class="ey-input-input" type="text" name="" id="" value="" placeholder="请输入参数值">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="add-attr">+添加参数</div>
        </div>
        
        </form>

        
        <div class="bottom-popup">
          <div class="popup-content">
            <h5>添加文档属性：</h5>
            <div class="box-checkbox">
                <label><span>头条</span><input type="checkbox" name="is_head" value="1"></label>
            </div>
              
              
            <button class="btn btn-primary submit-btn">确定</button>
          </div>
        </div>
        
        
        
        <div class="ey-header-lin-height"></div>
        <div class="w100-footer-wrap fixed-footer-wrap">
            <button class="w50-btn-no" data-url="{:weapp_url('Mbackend/Archives/index_archives')}" onclick="unifiedJump(this);">返回</button>
            <button class="w50-btn" onclick="submitForm();">保存</button>
        </div>
    </div>
    <!-- 采用snow主题 -->
    <link href="__WEAPP_TEMPLATE__/skin/css/quill.snow.css" rel="stylesheet">
    <!-- quill的主要js文件 -->
    <script src="__WEAPP_TEMPLATE__/skin/js/quill.min.js?v={$weappInfo.version|default='v1.0.0'}"></script>
    <script src="__WEAPP_TEMPLATE__/skin/js/image-resize.min.js?v={$weappInfo.version|default='v1.0.0'}"></script>
    <script type="text/javascript">
        $('.tab-wrap .tab-item').on('click', function () {
            $(this).addClass('active').siblings().removeClass('active');
            $('.item-wrap-box').hide().eq($('.tab-wrap .tab-item').index(this)).show();
        });
        var aaaa = getBrowserToolbarHeight();
        // 图片上传
        function upload_litpic(obj) {
            var file = $(obj)[0].files[0];
            if (!file) return false;
            var formData = new FormData();
            formData.append('_ajax', 1);
            formData.append('file', file);
            formData.append('weappAjax', 1);
            formData.append('compress', '1000-1000');
            layerLoading('正在上传');
            $.ajax({
                type: 'post',
                url : "{:url('Ueditor/imageUp')}",
                data: formData,
                dataType: 'json',
                contentType: false,
                processData: false,
                success: function (res) {
                    layer.closeAll();
                    if (res.state == 'SUCCESS') {
                        $('#img_litpic').val(res.url);
                        $('#a_litpic').find('div').hide();
                        $('#a_litpic').find('img').show().attr('src', res.url);
                        layerMsg('上传成功');
                    } else {
                        $('#img_litpic').val('');
                        $('#a_litpic').find('div').show();
                        $('#a_litpic').find('img').hide();
                        layerAlert(res.state);
                    }
                },
                error: function(e) {
                    layer.closeAll();
                    layerAlert(e.responseText);
                }
            })
        }
        function getBrowserToolbarHeight(viewportHeight,toolbarHeight) {
          var windowHeight = window.innerHeight; // 窗口的总高度
          var viewportHeight = document.documentElement.clientHeight; // 窗口的可视区域高度
          var toolbarHeight = windowHeight - viewportHeight; // 工具条的高度
        	
          return {windowHeight:windowHeight, viewportHeight:viewportHeight, toolbarHeight:toolbarHeight};
        }
        // 打开商品服务选择框
        function openArcAttr() {
            var content = $('#arcAttr').html();
            layer.open({
                anim: 'up',
                content: content,
                shadeClose: false,
                title: ['商品服务'],
                btn: ['确定', '关闭'],
                success: function() {
                    $('.layui-m-layercont').find('input').eq(0).remove();
                },
                yes: function(index) {
                    $('#arcAttr .allAttr').each(function() {
                        if (1 === parseInt($('#arcAttr .attr_' + $(this).attr('field')).val())) {
                            $('#arcAttr .new_attr_' + $(this).attr('field')).attr('checked', true);
                        } else {
                            $('#arcAttr .new_attr_' + $(this).attr('field')).removeAttr('checked');
                        }
                    });
                    layer.close(index);
                },
                no: function() {
                    $('#arcAttr').html(content);
                }
            });
        }
        
        // 选择商品服务
        function selectArcAttr(name, new_name) {
            if (1 === parseInt($('#arcAttr ' + name).val())) {
                $('#arcAttr ' + name).val(0);
                $(new_name).removeAttr('checked');
            } else {
                $('#arcAttr ' + name).val(1);
                $(new_name).attr('checked', true);
            }
        }
        
        // 打开发货方式选择框
        function openLogistics() {
            var content = $('#logisTics').html();
            layer.open({
                anim: 'up',
                content: content,
                shadeClose: false,
                title: ['发货方式'],
                btn: ['确定', '关闭'],
                success: function() {
                    $('.layui-m-layercont').find('input').eq(0).remove();
                },
                yes: function(index) {
                    $('#logisTics .allAttr').each(function() {
                        if (1 === parseInt($('#logisTics .attr_' + $(this).attr('field')).val())) {
                            $('#logisTics .new_attr_' + $(this).attr('field')).attr('checked', true);
                        } else {
                            $('#logisTics .new_attr_' + $(this).attr('field')).removeAttr('checked');
                        }
                    });
                    layer.close(index);
                },
                no: function() {
                    $('#logisTics').html(content);
                }
            });
        }
        
        // 选择发货方式
        function selectLogistics(name, new_name) {
            if (1 === parseInt($('#logisTics ' + name).val())) {
                $('#logisTics ' + name).val(0);
                $(new_name).removeAttr('checked');
            } else {
                $('#logisTics ' + name).val(1);
                $(new_name).attr('checked', true);
            }
        }
        // 打开内容编辑器
        function openContent(aid) {
            $.ajax({
                url : "{:weapp_url('Mbackend/ShopProduct/openContent')}",
                data: {aid: aid, _ajax: 1},
                type: 'post',
                dataType: 'json',
                success: function(res) {
                    if (1 === parseInt(res.code)) {
                        var content = '<div id="editor" class="ideditor" style="overflow-y: scroll;height: calc('+aaaa.windowHeight+'px-'+aaaa.toolbarHeight+'px;margin-bottom:'+aaaa.toolbarHeight+'px);">' + res.data.content + '</div>';
                        // content += '<div><button onclick="confirm();">确定</button><button onclick="cancel();">取消</button></div>';
                        var pageii = layer.open({
                            type: 1,
                            anim: 'up',
                            className: 'layui-m-editor',
                            content: content,
                            shadeClose: false,
                            title: ['内容详情'],
                            style: 'position: fixed; left:0; top:0; width:100%; height:100%; border: none; -webkit-animation-duration: .5s; animation-duration: .5s;',
                            btn: ['确定', '取消'],
                            success: function(layero, index) {
                                var quill = new Quill('#editor', {
                                    theme: 'snow',
                                    modules: {
                                        imageResize: {},
                                        toolbar: [
                                            [{ header: [1, 2, false] }],
                                            ['bold', 'italic', 'underline', 'image', 'link', 'clean'],
                                        ],
                                    },
                                });
                            },
                            yes: function(index) {
                                saveContent(aid, $('#editor .ql-editor').html());
                            }
                        });
                    } else {
                        layerAlert(res.msg);
                    }
                },
                error: function(e) {
                    layerAlert(e.responseText);
                }
            });
        }
        
        // 保存编辑器内容到 cookie
        function saveContent(aid, content) {
            $.ajax({
                url : "{:weapp_url('Mbackend/ShopProduct/saveContent')}",
                data: {aid: aid, content: content, _ajax: 1},
                type: 'post',
                dataType: 'json',
                success: function(res) {
                    layer.closeAll();
                },
                error: function(e) {
                    layerAlert(e.responseText);
                }
            });
        }
        
        // 提交保存文章
        function submitForm() {
            layerLoading('正在处理');
            $('#postForm').submit();
        }
    </script>
</body>
{include file="public/footer.htm" /}